<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>王者荣耀官方网站-腾讯游戏</title>
  <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
  <link rel="stylesheet" href="css/index.css">
</head>

<body>
  <!-- 网页头部 -->
  <div class="header">
    <!-- 一级导航栏 -->
    <div class="header-nav">
      <h1><a href="#" class="logo" title="王者荣耀">王者荣耀</a></h1>
      <ul class="main-nav">
        <li><a href="#">官网首页<span>HOME</span></a></li>
        <li><a href="#">游戏资料<span>DATA</span></a></li>
        <li><a href="#">内容中心<span>CONTENTS</span></a></li>
        <li><a href="#">赛事中心<span>MATCH<span></a></li>
        <li><a href="#">百态王者<span>CULTURE</span></a></li>
        <li><a href="#">社区互动<span>COMMUNITY</span></a></li>
        <li><a href="#">玩家支持<span>PLAYER</span></a></li>
      </ul>
      <div class="logo-sign">
        <img src="images/login.png" alt="欢迎登录">
        <div class="unlogin">
          <p class="welcome">欢迎登录</p>
          <p>登录后查看游戏战绩</p>
        </div>
      </div>
    </div>
    <!-- 二级导航栏 -->
    <div class="header-scnav">
      <ul>
        <li>&nbsp;</li>
        <li>
          <a href="">版本介绍</a>
          <a href="">游戏介绍</a>
          <a href="">英雄资料</a>
          <a href=""><i class="icon-fans"></i>爆料站</a>
          <a href=""><i class="icon-fans"></i>故事站</a>
          <a href="">游戏壁纸</a>
          <a href=""><i class="icon-fans"></i>模拟战资料库</a>
        </li>
        <li>
          <a href="">攻略中心</a>
          <a href="">英雄攻略</a>
          <a href="">视频中心</a>
          <a href=""><i class="icon-fans"></i>开放素材库</a>
          <a href="">王者视角</a>
          <a href="">作者入驻</a>
          <a href="">媒体入驻</a>
        </li>
        <li>
          <a href=""><i class="icon-hot"></i>KPL</a>
          <a href="">冬季冠军杯</a>
          <a href=""><i class="icon-fans"></i>模拟战冬冠</a>
          <a href="">KPLGT</a>
          <a href="">高校赛</a>
          <a href="">大众赛</a>
          <a href="">全民赛</a>
          <a href=""><i class="icon-fans"></i>赛事数据</a>
        </li>
        <li>
          <a href="">荣耀·传承</a>
          <a href="">王者文化站</a>
          <a href="">王者音乐听</a>
          <a href="">万千世界</a>
          <a href="">星光殿堂</a>
          <a href="">商户特权</a>
          <a href=""><i class="icon-fans"></i>无限王者团</a>
        </li>
        <li>
          <a href=""><i class="icon-fans"></i>创意互动营</a>
          <a href=""><i class="icon-hot"></i>王者营地</a>
          <a href="">手Q部落</a>
          <a href="">微信圈子</a>
          <a href="">官方微博</a>
          <a href="">微信公众号</a>
          <a href="">手Q订阅区</a>
          <a href="">同人社区</a>
        </li>
        <li>
          <a href=""><i class="icon-guard"></i>成长守护平台</a>
          <a href=""><i class="icon-health"></i>健康系统</a>
          <a href=""><i class="icon-fans"></i>对局环境情报站</a>
          <a href="">客服专区</a>
          <a href="">礼包兑换</a>
          <a href="">自助服务</a>
        </li>
      </ul>
    </div>
  </div>
  <!-- 网页内容 -->
  <div class="main">
    <a href="#" title="查看详情" class="detail">查看详情</a>
    <div class="container">
      <div class="showFocus">
        <ul class="showFocus-img">
          <li>
            <a href=""><img src="./images/banner1.jpeg" alt=""></a>
          </li>
          <li>
            <a href=""><img src="./images/banner2.png" alt=""></a>
          </li>
          <li>
            <a href=""><img src="./images/banner3.jpeg" alt=""></a>
          </li>
          <li>
            <a href=""><img src="./images/banner4.jpeg" alt=""></a>
          </li>
          <li>
            <a href=""><img src="./images/banner5.jpeg" alt=""></a>
          </li>
        </ul>

        <ul class="showFocus-title">

          <li class="active">新版本内容大合集</li>
          <li class="">小红书创作有好礼</li>
          <li class="">如何华丽上线镜</li>
          <li class="">国民记忆主题站</li>
          <li class="">王者视角</li>

        </ul>
      </div>

      <div class="showNews">
        <ul class="title-container">
          <li class="active"><span>热门</span></li>
          <li class=""><span>新闻</span></li>
          <li class=""><span>公告</span></li>
          <li class=""><span>活动</span></li>
          <li class=""><span>赛事</span></li>
          <li class=""><a href="">...</a></li>
        </ul>

        <div class="news-banner">
          <div class="news-blocks" style="margin-left: 0%;">
            <ul class="newslist">
              <li>
                <a href="">4月5日开服及奖励通知</a>
              </li>
              <li><a href="">全国哀悼日停服公告</a><span>04/03</span></li>
              <li><a href="">4月4日全服停机更新公告</a><span>04/03</span></li>
              <li><a href="">4月4日体验服停机更新公告</a><span>04/03</span></li>
              <li><a href="">4月3日体验服停机更新公告</a><span>04/03</span></li>
              <li><a href="">4月2日“演员”惩罚名单</a><span>04/02</span></li>
              <li><a href="">4月2日体验服停机更新公告</a><span>04/02</span></li>
              <li><a href="">4月2日全服不停机优化公告</a><span>04/02</span></li>
            </ul>
            <ul class="newslist">
              <li>
                <a href="">冷艳御姐是如何练成的？参与「镜」主题创作赢荣耀水晶</a>
              </li>
              <li><a href="">廉颇重塑计划爆料</a><span>04/02</span></li>
              <li>
                <a href="">正式服预告④丨新版本倒数3天，战场升级计划即将启动</a><span>03/28</span>
              </li>
              <li>
                <a href="">正式服预告③丨新英雄镜即将登场，将军白起优化升级！</a><span>03/27</span>
              </li>
              <li>
                <a href="">版本动画《玄雍梦魇》·镜先导片上线！</a><span>03/26</span>
              </li>
              <li>
                <a href="">正式服预告②丨荣耀战令福利更新，峡谷历险即刻启程</a><span>03/25</span>
              </li>
              <li>
                <a href="">正式服预告①丨玄雍危机降临，S19新赛季来袭！</a><span>03/24</span>
              </li>
              <li>
                <a href="">新皮肤爆料丨灵猫化身刺客，不知火舞新装登场~</a><span>03/20</span>
              </li>
            </ul>
            <ul class="newslist">
              <li>
                <a href="">4月5日开服及奖励通知</a>
              </li>
              <li><a href="">4月4日全服停机更新公告</a><span>04/03</span></li>
              <li><a href="">全国哀悼日停服公告</a><span>04/03</span></li>
              <li><a href="">4月4日体验服停机更新公告</a><span>04/03</span></li>
              <li><a href="">4月3日体验服停机更新公告</a><span>04/03</span></li>
              <li><a href="">4月2日“演员”惩罚名单</a><span>04/02</span></li>
              <li><a href="">4月2日体验服停机更新公告</a><span>04/02</span></li>
              <li><a href="">4月2日全服不停机优化公告</a><span>04/02</span></li>
            </ul>
            <ul class="newslist">
              <li>
                <a href="">【预告】荣耀中国节·轻风戏纸鸢，参与必得纸鸢回城特效（永久）</a>
              </li>
              <li>
                <a href="">参与“S19战令集结号”，赢80级直升经验大礼</a><span>04/01</span>
              </li>
              <li>
                <a href="">【镜界诞生 见证觉醒】活动公告</a><span>03/31</span>
              </li>
              <li>
                <a href="">S19赛季来临 多重好礼邀你开启全新赛季</a><span>03/30</span>
              </li>
              <li><a href="">抢先服更新 S19赛季开启</a><span>03/26</span></li>
              <li>
                <a href="">微信游戏中心微券功能说明(二期)</a><span>03/25</span>
              </li>
              <li>
                <a href="">【奇遇 咕嗒的寻宝之旅】活动公告</a><span>03/25</span>
              </li>
              <li>
                <a href="">梦境修炼活动提前结束公告说明</a><span>03/24</span>
              </li>
            </ul>
            <ul class="newslist">
              <li>
                <a href="">KPL王者荣耀职业联赛4月4日比赛停赛公告</a>
              </li>
              <li>
                <a href="">《王者荣耀》城市赛选手看过来！新版本“玄雍危机”热门英雄玩法盘点</a><span>04/02</span>
              </li>
              <li>
                <a href="">【KPL今日预报】武汉ES vs
                  重庆QG，武汉eStar春季赛首秀能否首胜？</a><span>03/28</span>
              </li>
              <li>
                <a href="">高校联赛解说大赛正式开启报名</a><span>03/26</span>
              </li>
              <li>
                <a href="">【KPL今日预报】WE vs 成都AG超玩会，成都AG能否收获三连胜？</a><span>03/26</span>
              </li>
              <li>
                <a href="">3月28日部分比赛时间调整公告</a><span>03/25</span>
              </li>
              <li>
                <a href="">触手王者荣耀新秀杯报名启动 全国大赛邀请赛名额等你来战</a><span>03/23</span>
              </li>
              <li>
                <a href="">名嘴之路即将启动！第二届王者荣耀高校解说大赛听你来说</a><span>03/23</span>
              </li>
            </ul>
          </div>
        </div>
      </div>

      <div class="fr download-area">
        <a href="" class="icon download"></a>
        <a href="" class="icon vs"></a>
        <a href="" class="icon exp"></a>
      </div>
    </div>
  </div>
  <!-- 网页广告区 -->
  <div class="adv">
    <a href=""><img src="./images/entry1.jpg" alt=""></a>
    <a href=""><img src="./images/entry2.jpg" alt=""></a>
    <a href=""><img src="./images/entry3.jpg" alt=""></a>
    <a href=""><img src="./images/entry4.jpg" alt=""></a>
  </div>
  <!-- 网页尾部 -->
  <div class="footer">
    <div class="tencent">
      <div class="footer-logo">
        <a href=""></a>
      </div>
      <div class="footer-links">
        <div class="footer-left-links fl">
          <p>
            <span>抵制不良游戏</span>
            <span>拒绝盗版游戏</span>
            <span>注意自我保护</span>
            <span>谨防受骗上当</span>
            <span>适度游戏益脑</span>
            <span>沉迷游戏伤身</span>
            <span>合理安排时间</span>
            <span>享受健康生活</span>
          </p>
          <p class="intro">
            《王者荣耀》全部背景故事发生于架空世界“王者大陆”中。相关人物、地理、事件均为艺术创作，并非正史。若因观看王者故事对相关历史人物产生兴趣，建议查阅正史记载。
          </p>
        </div>
        <div class="footer-right-links fr">
          <p>
            腾讯互动娱乐|服务条款|隐私保护指引|儿童隐私保护指引|腾讯游戏招聘|腾讯游戏客服|游戏列表|广告服务及商务合作
          </p>
          <p>
            COPYRIGHT © 1998 - 2020 TENCENT. ALL RIGHTS RESERVED.
            <br>
            粤网文[2017]6138-1456号|（总）网出证（粤）字第057号
            <br>
            文网游备字[2016]M-CSG 0059 号|新广出审[2017] 6712号|ISBN
            978-7-7979-8408-9
          </p>
          <p>
            全国文化市场统一举报电话：12318
          </p>
        </div>
      </div>
    </div>
  </div>
  <!-- 登陆界面 -->
  <div class="loginScreen">
    <div class="login">
      <a href="" class="weixin"></a>
      <a href="" class="qq"></a>
      <a href="" class="close"></a>
    </div>
  </div>
  <!-- 浮动广告 -->
  <div class="right-nav">
    <div class="hero">
      <a href="">下载王者营地每天领福利~</a>
    </div>
    <ul class="menus">
      <li>
        <img src="./images/r_code.jpg" alt="">
      </li>
      <li>
        <span class="weibo"></span>
      </li>
      <li>
        <span class="weixin"></span>
        <div class="sub-menu">
          <img src="./images/weixin.jpg" alt="">
          <p>扫码<span>关注官方公众号</span></p>
          <p>获取<span>最新资讯及好礼</span></p>
        </div>
      </li>
      <li>
        <span class="master"></span>
        <div class="sub-menu">
          <img src="./images/card.png" alt="">
          <p>扫码查看你拥有的专属身份</p>
        </div>
      </li>
    </ul>
  </div>

  <script src="./js/index.js"></script>
</body>

</html>